// 登录阻拦组件

import "./index.less";
import {Button, Image, Text, View} from "@tarojs/components";
import {GLOBAL_IMAGE} from "../../constant/contant";

export function LoginMask(props) {
    const {showLoginMask, closeLoginMask, getUserInfo} = props;

    return (
        <View className={"loginMask"} style={{display: showLoginMask ? "flex" : "none"}}>
            <View className={"modal"}>
                <View className={"modal_top"}>
                    <View className={"modal_close"} onClick={closeLoginMask}>
                        <Image src={GLOBAL_IMAGE.modal_close}/>
                    </View>
                </View>
                <View className={"modal_bot"}>
                    <View className={"modal_modal"}
                          style={{
                              backgroundImage: `url(${GLOBAL_IMAGE.login_modal})`,
                              backgroundSize: "100% 100%",
                          }}
                    >
                        <Button className={"login_btn"}
                                onClick={getUserInfo}
                        >
                            <Text>微信一键登录</Text>
                        </Button>
                        <View className={"modal_tip"}>
                            <Text>首次登录将为您创建账号</Text>
                        </View>
                    </View>
                </View>
            </View>
        </View>
    )

}
